<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>详情</title>
    <link rel="stylesheet" type="text/css" href="__CSS__/api.css" />
    <link rel="stylesheet" type="text/css" href="__CSS__/aui.css" />
    <link rel="stylesheet" type="text/css" href="__CSS__/swiper.min.css">
    <style>
        body {
            background-color: #fff;
        }

        .aui-iconfont {
            position: relative;
            font-family: "aui_iconfont" !important;
            font-size: 0.7rem;
            font-style: normal;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            height: 2.4rem;
        }

        .aui-icon-tu {
            height: 2.4rem;
            width: 2.75rem;
            background: url('__IMG__/back.png') no-repeat center center;
            background-size: 1.75rem 1.75rem;
        }
        .aui-bar-nav{
          background-color: rgba(0,0,0,0);
          position: fixed;
          top:0;
          left:0;
        }
        .aui-bar-nav .aui-title {
            font-size: 0.9rem;
            color: #333333;
            font-weight: 500;
        }
        .aui-icon-rightu{
            height: 2.4rem;
            width: 2.75rem;
            background: url('__IMG__/top_car.png') no-repeat 0.6rem center;
            background-size: 1.75rem 1.75rem;
        }
        .swiper-container {
    			width: 100%;
    			height:15.25rem;
		    }
        .swiper-slide img{
    			width:100%;
          height:100%;
    		}
       .swiper-pagination-bullet {
  		    width: 6px;
  		    height: 6px;
  		    display: inline-block;
  		    border-radius: 100%;
  		    background: #D8D8D8;
		    }
	     .swiper-pagination-bullet-active{
    			background: #F04040;
    		}
        .outer{
          padding-left: 0.5rem;
          padding-right: 0.5rem;
        }
        .tit{
          padding-top: 0.525rem;
          padding-bottom: 0.575rem;
          font-size: 15px;
          color:#404040;
          text-align: center;
        }
        .buy{
          height: 1.8rem;
          line-height: 1.8rem;
          margin-bottom: 1.1rem;
        }
        .price{
          font-size: 24px;
          color:#F04040;
        }
        .delete{
          font-size: 14px;
          color:#999;
          padding-left: 0.625rem;
          text-decoration:line-through
        }
        .add{
          width: 5.125rem;
          height: 1.8rem;
          line-height: 1.8rem;
          text-align: center;
          color: #fff;
          font-size: 15px;
          background:linear-gradient(-127deg,rgba(240,64,64,1),rgba(255,122,122,1));
          border-radius:4px;
        }
        .gray{
          height:3px;
          background-color:#F4F4F4;
        }
        .top{
          height:2.4rem;
          line-height: 2.5rem;
          margin-left: 0.5rem;
          margin-right: 0.5rem;
          color: #555;
          font-size: 13px;
        }
        .shop{
          width:0.525rem;
          height: 0.5rem;
          margin-top:0.975rem;
          margin-right: 6.5px;
        }
        .call{
          width:0.525rem;
          height: 0.525rem;
          margin-top:0.96rem;
          margin-right: 5.5px;
        }

        .comment{
          /*height:3.325rem;*/
          margin-left:0.5rem;
          margin-right:0.5rem;
          padding-top:0.8rem;
          padding-bottom: 0.5rem;
        }
        .avatar {
          width: 2.325rem;
          height: 2.325rem;
          border-radius: 50%;
          margin-right: 0.6rem;
        }
        .avatar img {
          width: 100%;
          height: 100%;
          border-radius: 50%;
        }
        .nickname {
    			font-size: 13px;
    			color: #555;
    			padding-bottom: 6.5px;
    		}

    		.phone {
    			font-size: 12px;
    			color: #B7B7B7;
    		}
        .xing{
          width:0.55rem;
          height:0.55rem;
          background: url(__IMG__/star3.png) no-repeat center center;
          background-size: 0.55rem;
          margin-right:3.5px;
        }
        .xing1{
          width:0.55rem;
          height:0.55rem;
          background: url(__IMG__/star4.png) no-repeat center center;
          background-size: 0.55rem;
          margin-right:3.5px;
        }
        .num{
          font-size: 14px;
          color: #555;
          padding-top: 0.75rem;
        }
        .score{
          font-size: 14px;
          color: #555;
          padding-top: 0.75rem;
          padding-right: 5.5px;
        }
        .red{
          color: #F04040;
        }
        .arrow{
          width: 4.5px;
          height: 9px;
          background: url(__IMG__/right_arrow.png) no-repeat center center;
          background-size: 4.5px 9px;
          margin-top: 0.95rem;
        }
        .aui-badge {
			    display: inline-block;
			    text-align: center;
			    font-size: 0.5rem;
			    min-width: 0.76rem;
			    height: 0.76rem;
			    line-height: 0.76rem;
			    padding: 0.0rem;
			    color: #fff;
			    border: 1px solid #F04040;
			    background-color: #F04040;
			    border-radius: 50%;
			    position: absolute;
			    top: 0.2rem;
			    right: 8px;
			    z-index: 99;
			}
      .foot{
        position: fixed;
        left: 0;
        bottom: 0;
        width:100%;
        height:2.2rem;
        padding-left: 0.5rem;
        background-color: #F4F4F4;
      }
      .button{
        height:2.2rem;
        line-height:2.2rem;
        padding-left: 16px;
        padding-right:16px;
        color:#fff;
        font-size:14px;
        background:linear-gradient(-127deg,rgba(240,64,64,1),rgba(255,122,122,1));
      }
      .jian,.jia {
  			width: 1rem;
  			height: 1rem;
  			margin-top:0.625rem;
  	  }
  	  .number {
  			padding-left:1.4rem;
  			padding-right:1.4rem;
  			padding-top: 0.6rem;
  			font-size: 14px;
  			color: #666;
  		}
    </style>
</head>

<body>
    <header class="aui-bar aui-bar-nav" style="padding-top:25px;" id="header">
        <a class="aui-pull-left" tapmode="active" onclick="window.history.back(-1);"> <span class="aui-iconfont aui-icon-tu"> </span> </a>
        <!-- <div class="aui-title">热销</div> -->
        <a class="aui-pull-right" style="position:relative;">
            <span class="aui-iconfont aui-icon-rightu" tapmode="active" onclick="right()"></span>
            <!--<div class="aui-badge" id='hongPoint' ><span id='hongNumber'></span>5</div>-->
        </a>
    </header>


    {if $good.g_thumb}
    <div class="swiper-container">
        <div class="swiper-wrapper" style='width:100%;' id='list1'>
            <!--volist name="good['g_image']" id='gg'-->
            <div class="swiper-slide">
                <img src="{$good.g_thumb}">
            </div>
            <!--/volist-->
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination" style="width:100%;height:0.9rem;"></div>
    </div>
    {else /}
    <img src="{$gg ?? '__IMG__/zhanweitu/a2.png'}" style="height: 10rem;width: 100%;">
    {/if}
    
<div id="list2"></div>
    <div>
      <div class="tit outer">{$good.g_name ?? ''}&nbsp;&nbsp;&nbsp;{$good.g_weight ?? ''}</div>
      <div class="buy flex-wrap outer">
      	  {if $good.g_prcie_kill > 0}
      	    <div class="price">￥{$good.g_prcie_kill}</div>
      	  {else /}
        	 <div class="price">￥{$good.g_price_now}</div>
          {/if}
          <div class="flex-con"></div>
         <!-- <div class="add" tapmode onclick="addProduct(this)"; g_id='{$good.g_id}'>加入购物车</div>-->
      </div>
    </div>
    <div class="gray"></div>
    <div class="top flex-wrap underLine">
      <div class="shop"><img src="__IMG__/shop.png" /></div>
      <div class="shop_name">{$good.type ?? ''}</div>
      <div class="flex-con"></div>
      <a class="call" href="tel:{$good.phone}"><img src="__IMG__/call.png" /></a>
      <a class="connect" href="tel:{$good.phone}" style="color: #555">联系商家</a>
    </div>


    <div class="title flex-wrap outer">
      <div class="num">商品评价（{$good.g_num}）</div>
      <div class="flex-con"></div>
      <div class="score">评分<span class="red">{$good.g_score ?? '0'}</span></div>
      <div class="arrow"></div>
    </div>

<div id="list3"></div>
{volist name='pl' id='p'}
<div class="comment flex-wrap underLine">
    <div class="avatar">
        <img src="{$p.user_image ?? '__IMG__/zhanweitu/touxiang2.png'}">
    </div>
    <div class="flex-con">
        <div class="nickname aui-ellipsis-1">{$p.user_username ?? ''}</div>
        <div class="phone">{$p.user_phone|substr=0,3}****{$p.user_phone|substr=7,4}</div>
    </div>
    <div class="star flex-wrap">
        {for start='0' end="$p['comment_score']"}
        <div class="xing"></div>
        {/for}
        {for start='0' end="5-$p['comment_score']"}
        <div class="xing1"></div>
        {/for}
    </div>
</div>
{/volist}


<div id="list4" style="height: 2.5rem;width: 100%;clear: both">&nbsp;</div>
<div class="foot">
    <div class="flex-wrap">
      <div class="flex-con">
        <div class="flex-wrap">
          <div class="jian" onclick="delectOneProductAllPointtt(this);" g_id='{$good.g_id}'><img src="__IMG__/jian.png" alt=""></div>
          <div class="number" id='numberrr_{$good.g_id}'>{$good.haveNum}</div>
          <div class="jia" onclick="addOneProductAllPointtt(this)" g_id='{$good.g_id}'><img src="__IMG__/add.png" alt=""></div>
        </div>
      </div>
      <div class="button" onclick="addOneProductAllPointtt(this)" g_id='{$good.g_id}'>加入购物车</div>
    </div>
</div>

</body>
<script type="text/javascript" src="__JS__/jquery.min.js"></script>
<script type="text/javascript" src="__JS__/swiper.min.js"></script>
<script type="text/javascript" src="__JS__/tt22.js"></script>
<script type="text/javascript">
    var swiper = new Swiper('.swiper-container', {
        slidesPerView: 'auto',
        loop: true,
        autoplay: 3000,
        autoplayDisableOnInteraction: false,
        pagination: '.swiper-pagination',
    });
    //右边点击事件
    function right() {
        location.href = '{:url("home/Car/index")}';
    }
</script>

</html>
